@import (reference) 'config';
@import (reference) '../../../app/less/typography';
@import (reference) 'icons';

.gateway {

  .gateway-icon {
    margin: 30px auto 50px auto;

    img {
      display: inline-block;
      min-width: 140px;
      min-height: 30px;
      max-width: 200px;
      max-height: 50px;
    }
    div {
      margin: 0 auto;
    }
  }

  h3 {
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    span.link {
      font-size: inherit;
      cursor: text;
      word-wrap: break-word;
    }
  }

  .row {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;

    &.bordered {
      border-top: 1px solid @color-basic-200;
      border-bottom: 1px solid @color-basic-200;
    }
  }

  .content {
    i {
      display: inline-block;
      vertical-align: top;
      min-width: 24px;
    }
  }

  .flex-caption {
    display: flex;
    align-items: flex-start;

    div {
      flex-grow: 1;
    }
  }

  .buttons-wrapper {
    display: flex;
    justify-content: space-between;

    & > w-button {
      flex-basis: 48%;
    }
  }

  .plate-note {
    overflow: auto;
  }
}
